<!DOCTYPE html>
<html lang="zh-CN" >

<!-- 1.通过该声明，将静态页面转换为动态的视图。需要进行动态处理的元素将使用“th:”为前缀 -->
<head>
<meta content="text/html;charset=UTF-8" />
<title>login</title>
 <!-- <link href="D:/eclipseworkspace/demo-springboot-mybatis/src/main/resources/static/css/bootstrap-css/bootstrap.css" rel="stylesheet"></link>
<link href="D:/eclipseworkspace/demo-springboot-mybatis/src/main/resources/static/css/login.css" rel="stylesheet"></link>
<script src="D:/eclipseworkspace/demo-springboot-mybatis/src/main/resources/static/js/jquery/jquery-3.1.1.js"></script>
<script src="https://cdn.bootcss.com/tether/1.4.0/js/tether.min.js" ></script>
<script src="D:/eclipseworkspace/demo-springboot-mybatis/src/main/resources/static/js/bootstrap-js/bootstrap.min.js"></script> --> <!-- -->
    <link rel="stylesheet" href="css/font-css.css">  <!-- Google web font "Open Sans" -->
    <link rel="stylesheet" href="css/bootstrap.min.css">                                      <!-- Bootstrap style -->
<link href="css/login.css" rel="stylesheet"></link>
  <script src="js/bootstrap-js/jquery-1.11.3.min.js"></script>             <!-- jQuery (https://jquery.com/download/) -->
        <script src="js/bootstrap-js/tether.min.js"></script> <!-- Tether for Bootstrap, http://stackoverflow.com/questions/34567939/how-to-fix-the-error-error-bootstrap-tooltips-require-tether-http-github-h --> 
        <script src="js/bootstrap-js/bootstrap.min.js"></script>                 <!-- Bootstrap (http://v4-alpha.getbootstrap.com/) -->
</head>

<body>
<div class="container">
    <div class="row">
        <div class="col-md-offset-3 col-md-6">
            <form class="form-horizontal"  >
                <span class="heading">用户登录</span>
                <div class="form-group">
                    <input type="text" class="form-control" id="account_" placeholder="用户名或电子邮件">
                    <i class="fa fa-user"></i>
                </div>
                <div class="form-group help">
                    <input type="password" class="form-control" id="password_" placeholder="密　码">
                    <i class="fa fa-lock"></i>
                    <a href="#" class="fa fa-question-circle"></a>
                </div>
                <div class="form-group">
                    <div class="main-checkbox">
                        <input type="checkbox" value="None" id="checkbox1" name="check"/>
                        <label for="checkbox1"></label>
                    </div>
                    <span class="text">Remember me</span>
                    <button type="submit" class="btn btn-default" >登录</button>
                </div>
                <div class="form-group">
                    <span ></span>
                </div>
            </form>
        </div>
    </div>
</div>
<script>
function getRootPath_dc() {
    var pathName = window.location.pathname.substring(1);
    var webName = pathName == '' ? '' : pathName.substring(0, pathName.indexOf('/'));
    if (webName == "") {
      return window.location.protocol + '//' + window.location.host;
    }
    else {
      return window.location.protocol + '//' + window.location.host + '/' + webName;
    }
  }
  
  var basePath = getRootPath_dc();
    $(".form-horizontal").submit(function(){
    	var account_=$("#account_").val();
    	var password_=$("#password_").val();
          var jsonObj = {'account_':account_,'password_':password_};
    	$.ajax({
    		url:basePath+"/login",
    		type:'post',
    		//data:{'account_':$("#account_").val(),'password_':$("#account_").val()},
    		data:jsonObj,
    		async:false,
    		success:function(data){
    			 alert(data);
    		},
    		error:function(msg){
    			alert(msg);
    		}
    	});
    });
</script>
</body>
</html>